<template>
  <div>
    <div class="mb-10">
      <f-tag type="primary" dark checkable><span>primary</span></f-tag>
      <f-tag type="success" dark checkable>success</f-tag>
      <f-tag type="info" dark checkable>info</f-tag>
      <f-tag type="warning" dark checkable>warning</f-tag>
      <f-tag type="danger" dark checkable>danger</f-tag>
      <f-tag type="magenta" dark checkable>magenta</f-tag>
      <f-tag type="red" dark checkable>red</f-tag>
      <f-tag type="volcano" dark checkable>volcano</f-tag>
      <f-tag type="orange" dark checkable>orange</f-tag>
      <f-tag type="gold" dark checkable>gold</f-tag>
      <f-tag type="cyan" dark checkable>cyan</f-tag>
      <f-tag type="blue" dark checkable>blue</f-tag>
      <f-tag type="geekblue" dark checkable>geekblue</f-tag>
      <f-tag type="purple" dark checkable>purple</f-tag>
    </div>
    <div>
      <f-tag type="primary" checkable><span>primary</span></f-tag>
      <f-tag type="success" checkable>success</f-tag>
      <f-tag type="info" checkable>info</f-tag>
      <f-tag type="warning" checkable>warning</f-tag>
      <f-tag type="danger" checkable>danger</f-tag>
      <f-tag type="magenta" checkable>magenta</f-tag>
      <f-tag type="red" checkable>red</f-tag>
      <f-tag type="volcano" checkable>volcano</f-tag>
      <f-tag type="orange" checkable>orange</f-tag>
      <f-tag type="gold" checkable>gold</f-tag>
      <f-tag type="cyan" checkable>cyan</f-tag>
      <f-tag type="blue" checkable>blue</f-tag>
      <f-tag type="geekblue" checkable>geekblue</f-tag>
      <f-tag type="purple" checkable>purple</f-tag>
    </div>
  </div>
</template>
